<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>演讲评分系统</title>
    <link rel="stylesheet" href="styles.css">

    <!-- LeanCloud SDK -->
    <script src="https://unpkg.com/leancloud-storage@4.15.2/dist/av-min.js"></script>

    <!-- SheetJS库用于读取Excel文件 -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>

    <script>
        window.LC_CONFIG = {
            appId: 'qfHm1teoFkyfdBwcDUPrxX9t-gzGzoHsz',
            appKey: 'Qa82V9E5VdUpcejq5CJGfW5k',
            serverURL: 'https://qfhm1teo.lc-cn-n1-shared.com'
        };

        // 网络状态检测
        window.networkStatus = {
            isOnline: navigator.onLine,
            lastCheck: Date.now()
        };

        // 监听网络状态变化
        window.addEventListener('online', function () {
            window.networkStatus.isOnline = true;
            window.networkStatus.lastCheck = Date.now();
            console.log('网络已连接');
        });

        window.addEventListener('offline', function () {
            window.networkStatus.isOnline = false;
            window.networkStatus.lastCheck = Date.now();
            console.log('网络已断开');
        });
    </script>
</head>

<body>
    <div class="container">
        <header>
            <h1>演讲评分系统</h1>
            <div class="user-info">
                <span id="currentUser">未登录</span>
                <button id="loginBtn" class="btn">登录</button>
                <button id="logoutBtn" class="btn" style="display: none;">退出</button>
            </div>
        </header>



        <!-- 登录选择界面 -->
        <div id="loginSection" class="section">
            <h2>选择登录方式</h2>

            <!-- 会话ID输入区域 -->
            <div class="session-input-area">
                <h3>会话管理</h3>
                <div class="session-options">
                    <div class="session-option">
                        <input type="radio" id="createNewSession" name="sessionMode" value="new" checked>
                        <label for="createNewSession">创建新会话</label>
                    </div>
                    <div class="session-option">
                        <input type="radio" id="joinExistingSession" name="sessionMode" value="join">
                        <label for="joinExistingSession">加入现有会话</label>
                    </div>
                </div>
                <div id="sessionIdInput" class="session-id-input" style="display: none;">
                    <input type="text" id="sessionIdField" placeholder="请输入会话ID (SID)">
                    <small>请向管理员获取会话ID</small>
                </div>
                <div id="currentSessionInfo" class="current-session-info">
                    <span>当前会话ID: <strong id="currentSessionId">未设置</strong></span>
                </div>
            </div>

            <div class="login-options">
                <button id="adminLoginBtn" class="btn btn-primary login-option-btn">管理员登录</button>
                <button id="judgeLoginBtn" class="btn login-option-btn">评委登录</button>
                <button id="speakerLoginBtn" class="btn login-option-btn">演讲者登录</button>
            </div>
        </div>

        <!-- 管理员登录界面 -->
        <div id="adminLoginSection" class="section" style="display: none;">
            <h2>管理员登录</h2>
            <div class="login-form">
                <input type="text" id="adminUsername" placeholder="管理员账号">
                <input type="password" id="adminPassword" placeholder="管理员密码">
                <button id="adminLoginSubmit" class="btn btn-primary">登录</button>
                <button id="backToLoginBtn" class="btn">返回</button>
            </div>
        </div>

        <!-- 评委/演讲者登录界面 -->
        <div id="userLoginSection" class="section" style="display: none;">
            <h2 id="userLoginTitle">用户登录</h2>

            <!-- 用户会话管理 -->
            <div class="session-input-area">
                <h3>会话管理</h3>
                <div class="session-options">
                    <div class="session-option">
                        <input type="radio" id="userJoinSession" name="userSessionMode" value="join" checked>
                        <label for="userJoinSession">加入现有会话</label>
                    </div>
                </div>
                <div class="session-id-input" id="userSessionIdInputArea">
                    <label for="userSessionIdInput">会话ID:</label>
                    <input type="text" id="userSessionIdInput" placeholder="请输入会话ID">
                </div>
                <div class="current-session-info">
                    <span>当前会话ID: </span><span id="userCurrentSessionId">未设置</span>
                </div>
            </div>

            <div class="login-form">
                <input type="text" id="userNameInput" placeholder="输入您的姓名">
                <input type="hidden" id="userTypeInput">
                <button id="userLoginSubmit" class="btn btn-primary">登录</button>
                <button id="backToLoginBtn2" class="btn">返回</button>
            </div>
        </div>

        <!-- 管理员界面 -->
        <div id="adminSection" class="section" style="display: none;">
            <h2>管理员控制台</h2>

            <div class="admin-panel">
                <div class="system-settings">
                    <h3>系统设置</h3>
                    <div class="settings-grid">
                        <div class="setting-item">
                            <label>总人数限制:</label>
                            <input type="number" id="maxUsersInput" min="3" max="50" value="6">
                        </div>
                        <div class="setting-item">
                            <label>演讲者人数:</label>
                            <input type="number" id="maxSpeakersInput" min="1" max="20" value="2">
                        </div>
                        <div class="setting-item">
                            <label>评委人数:</label>
                            <input type="number" id="maxJudgesInput" min="1" max="30" value="4">
                        </div>
                        <div class="setting-item">
                            <button id="updateSettingsBtn" class="btn btn-primary">更新设置</button>
                        </div>
                    </div>
                </div>

                <div class="class-management">
                    <h3>班级管理</h3>
                    <div class="class-controls">
                        <div class="current-class">
                            <label>当前班级:</label>
                            <select id="currentClassSelect">
                                <option value="">选择班级</option>
                            </select>
                        </div>
                        <div class="class-actions">
                            <button id="switchClassBtn" class="btn btn-primary">切换班级</button>
                        </div>
                    </div>
                    <div class="class-info">
                        <p>班级信息: <span id="classInfoDisplay">请选择班级</span></p>
                        <p>班级总人数: <span id="classTotalUsers">0</span> 人</p>
                        <p>班级数据: <span id="classDataCount">0</span> 个会话记录</p>
                    </div>
                </div>

                <div class="user-management">
                    <h3>用户管理</h3>
                    <div class="add-user">
                        <input type="text" id="newUserName" placeholder="用户姓名">
                        <button id="addUserBtn" class="btn">添加用户</button>
                        <button id="batchAddBtn" class="btn">批量添加</button>
                    </div>
                    <div class="excel-import">
                        <input type="file" id="excelFileInput" accept=".xlsx,.xls" style="display: none;">
                        <button id="importExcelBtn" class="btn btn-secondary">导入Excel表格</button>
                        <small class="help-text">支持.xlsx和.xls格式，将读取第一列作为用户名</small>
                    </div>
                    <div class="user-list">
                        <h4>所有用户 (<span id="totalUsers">0</span>/<span id="maxUsersDisplay">6</span>)</h4>
                        <ul id="allUsersList"></ul>
                    </div>
                </div>

                <div class="role-assignment">
                    <h3>角色分配</h3>
                    <div class="quick-assign">
                        <h4>快速分配</h4>
                        <div class="quick-assign-buttons">
                            <button id="clearRolesBtn" class="btn">清空所有角色</button>
                            <button id="randomAssignBtn" class="btn">随机分配</button>
                        </div>
                    </div>
                    <div class="available-users">
                        <h4>普通用户 (<span id="availableCount">0</span>)</h4>
                        <ul id="availableUsersList"></ul>
                    </div>
                    <div class="assigned-roles">
                        <div class="role-group">
                            <h4>演讲者 (<span id="speakerCount">0</span>/<span id="maxSpeakersDisplay">2</span>)</h4>
                            <ul id="assignedSpeakersList"></ul>
                        </div>
                        <div class="role-group">
                            <h4>评委 (<span id="judgeCount">0</span>/<span id="maxJudgesDisplay">4</span>)</h4>
                            <ul id="assignedJudgesList"></ul>
                        </div>
                    </div>
                </div>

                <div class="scoring-settings">
                    <h3>评分设置</h3>
                    <label>
                        <input type="radio" name="scoringMethod" value="trimmed" checked>
                        去掉最高最低分求平均值
                    </label>
                    <label>
                        <input type="radio" name="scoringMethod" value="weighted">
                        加权平均
                    </label>
                    <div class="scoring-buttons">
                        <button id="startScoringBtn" class="btn btn-primary">开始评分</button>
                        <button id="viewResultsBtn" class="btn">查看当前结果</button>
                        <button id="viewHistoryBtn" class="btn">查看历史记录</button>
                    </div>
                </div>

                <div class="session-management">
                    <h3>会话管理</h3>
                    <p>当前会话ID: <span id="currentSessionId">加载中...</span></p>
                    <div style="margin: 10px 0;">
                        <button id="newSessionBtn" class="btn">创建新会话</button>
                        <button id="joinSessionBtn" class="btn">加入会话</button>
                    </div>
                </div>

                <div class="sync-settings">
                    <h3>云端同步设置</h3>
                    <div class="sync-controls">
                        <div class="setting-item">
                            <label>
                                <input type="checkbox" id="enableSyncCheckbox" checked>
                                启用云端同步
                            </label>
                        </div>
                        <div class="setting-item">
                            <label>同步频率（秒）:</label>
                            <input type="number" id="syncFrequencyInput" min="1" max="60" value="5"
                                style="width: 80px;">
                            <button id="updateSyncFrequencyBtn" class="btn btn-small">更新</button>
                        </div>
                        <div class="sync-status">
                            <p>同步状态: <span id="syncStatusDisplay">已启用</span></p>
                            <p>最后同步: <span id="lastSyncTimeDisplay">未同步</span></p>
                        </div>
                    </div>
                </div>

                <div class="session-actions">
                    <h3>评选管理</h3>
                    <p>选择如何处理当前评选活动：</p>
                    <div class="action-buttons">
                        <button id="saveSessionBtn" class="btn btn-primary">保存这次评选</button>
                        <button id="discardSessionBtn" class="btn danger-btn">不保留此次评选</button>
                    </div>
                </div>

                <div class="danger-zone">
                    <h3>危险操作</h3>
                    <p>⚠️ 以下操作将永久删除数据，请谨慎操作！</p>
                    <div class="action-buttons">
                        <button id="clearUsersBtn" class="btn danger-btn">清除所有用户</button>
                        <button id="newSessionBtn2" class="btn btn-primary">开始新会话</button>
                    </div>
                </div>
            </div>
        </div>

        <!-- 评委界面 -->
        <div id="judgeSection" class="section" style="display: none;">
            <h2>评分界面</h2>
            <div style="margin-bottom: 20px;">
                <button id="judgeBackBtn" class="btn">返回登录</button>
            </div>
            <div id="speakersToScore"></div>
            <div class="judge-actions" style="margin-top: 20px; text-align: center;">
                <button id="judgeExportBtn" class="btn">导出我的评分记录</button>
            </div>
        </div>

        <!-- 演讲者界面 -->
        <div id="speakerSection" class="section" style="display: none;">
            <h2>演讲者信息</h2>
            <div id="speakerInfo"></div>
        </div>

        <!-- 结果展示 -->
        <div id="resultsSection" class="section" style="display: none;">
            <h2>评分结果</h2>
            <div class="results-controls">
                <button id="backToAdminBtn" class="btn" style="display: none;">返回管理</button>
                <button id="exportResultsBtn" class="btn">导出结果</button>
            </div>
            <div id="resultsDisplay"></div>
        </div>

        <!-- 历史记录界面 -->
        <div id="historySection" class="section" style="display: none;">
            <h2>历史评分记录</h2>
            <div class="history-controls">
                <button id="backToAdminFromHistoryBtn" class="btn">返回管理</button>
                <button id="refreshHistoryBtn" class="btn">刷新记录</button>
                <button id="exportAllHistoryBtn" class="btn">导出所有记录</button>
            </div>
            <div id="historyDisplay"></div>
        </div>
    </div>

    <script src="memory_storage.js"></script>
    <script src="storage_adapter.js"></script>
    <script src="script.js"></script>
    <script src="fixed_classes_data.js"></script>
</body>

</html>